import { Card } from 'antd';
import React from 'react';
import DisallowPageCache from './DisallowPageCache';
import DisallowPageScale from './DisallowPageScale';
import IgnoreAutoRecognition from './IgnoreAutoRecognition';
import NativeApp from './NativeApp';
import NoCapitalization from './NoCapitalization';
import NumberKeyBoard from './NumberKeyBoard';
import OtherBrowser from './OtherBrowser';
import Safari from './Safari';
import SystemFunction from './SystemFunction';
const tabList = [
    {
        key: 'SystemFunction',
        tab: '调用系统功能'
    },
    {
        key: 'IgnoreAutoRecognition',
        tab: '忽略自动识别'
    },
    {
        key: 'NumberKeyboard',
        tab: '弹出数字键盘',
    },
    {
        key: 'NativeApp',
        tab: '唤醒原生应用'
    },
    {
        key: 'DisallowPageScale',
        tab: '禁止页面缩放'
    },
    {
        key: 'DisallowPageCache',
        tab: '禁止页面缓存'
    },
    {
        key: 'NoCapitalization',
        tab: '禁止字母大写'
    },
    {
        key: 'Safari',
        tab: 'Safari'
    },
    {
        key: 'OtherBrowser',
        tab: '其他浏览器'
    }
]
export default () => {
    const [activeKey, setActiveKey] = React.useState('SystemFunction')
    
    const tabComponentList: any = {
        SystemFunction: <SystemFunction />,
        IgnoreAutoRecognition: <IgnoreAutoRecognition />,
        NumberKeyboard: <NumberKeyBoard />,
        NativeApp: <NativeApp />,
        DisallowPageScale: <DisallowPageScale />,
        DisallowPageCache: <DisallowPageCache />,
        NoCapitalization: <NoCapitalization />,
        Safari: <Safari />,
        OtherBrowser: <OtherBrowser />
    }
    return (
        <div>
            <Card
                tabList={tabList}
                activeTabKey={activeKey}
                onTabChange={key => setActiveKey(key)}
            >
                {tabComponentList[activeKey]}
            </Card>
        </div>
    )
}